<template>

    <div class="home">
        <div class='yuendongyuan'>运动猿</div>
        <div class='jibenxinxi'>
            <img src='./tupian/2.png' class='tup1' alt="图片">
            <span class='xingming'>赵健康</span>
            <div class='chenghoa'><span class='chneghaodziti1'>$ 初级</span></div>
            <div class='chenghoa1'><span class='chneghaodziti'>积分1236 ></span></div>
            <div class='qiandao'><span class='qiandao2'><i class='iconfont icon-Sign'></i>签到</span></div>
            <ul class='wdjibenxinxi'>
                <ul class='quchuyuanquan'>
                    <li class='xiangyoubianyiding1'>12000</li>
                    <li class="shoc">我的积分</li>
                </ul>
                <ul class='quchuyuanquan'>
                    <li class='xiangyoubianyiding1'>13000</li>
                    <li class="shoc">我的步数</li>
                </ul>
                <ul class='quchuyuanquan'>
                    <li class='xiangyoubianyiding'>3</li>
                    <li class="shoc12">收藏</li>
                </ul>
                <ul class='quchuyuanquan'>
                    <li class='xiangyoubianyiding'>3</li>
                    <li class="shoc1">我的动态</li>
                </ul>
            </ul>
            <img src='./tupian/1.png' class='tup2' alt="图片">
        </div>


        <div style="
    overflow:auto;
    height: 60vh;
    width: 100%;
    
    ">
            <div class='wddingdanxinxi'>
                <div class='wddiandan'><span class='wddingdanziti'>我的订单</span></div>
                <ul class='ulyihang'>
                    <ul class='quchuyuanquan'>
                        <li class='tubioayiangs'><i class="iconfont icon-daifukuan1"></i></li>
                        <li class='liziti'>待付款</li>
                    </ul>
                    <ul class='quchuyuanquan'>
                        <li class='tubioayiangs'><i class="iconfont icon-daifahuo"></i></li>
                        <li class='liziti'>待发货</li>
                    </ul>
                    <ul class='quchuyuanquan'>
                        <li class='tubioayiangs'><i class="iconfont icon-daishouhuo"></i></li>
                        <li class='liziti'>待收货</li>
                    </ul>
                    <ul class='quchuyuanquan'>
                        <li class='tubioayiangs'><i class="iconfont icon-yiwancheng"></i></li>
                        <li class='liziti'>已完成</li>
                    </ul>
                </ul>
            </div>

            <div class='wddingdanxinxi'>
                <ul class='ulyihang1'>
                    <ul class='quchuyuanquan'>
                        <li class='tubioayiangs1'><i class="iconfont icon-naozhong"></i></li>
                        <li class='lizitiss1'>体质检测</li>
                    </ul>
                    <ul class='quchuyuanquan'>
                        <li class='tubioayiangs11'><i class="iconfont icon-wodechengjiu"></i></li>
                        <li class='liziti1'>我的成就</li>
                    </ul>
                    <ul class='quchuyuanquan'>
                        <li class='tubioayiangs111'><i class="iconfont icon-shijian"></i></li>
                        <li class='liziti2'>训练计划</li>
                    </ul>
                    <ul class='quchuyuanquan'>
                        <li class='tubioayiangs1111'><i class="iconfont icon-qiyefuwu"></i></li>
                        <li class='liziti3'>企业服务</li>
                    </ul>
                </ul>
            </div>

            <div class='wddingdanxinxi'>
                <ul class='ulyihang'>
                    <ul class='quchuyuanquan'>
                        <li class='tubioayiangs2'><i class="iconfont icon-rili1"></i></li>
                        <li class='lizitisssswdmen'>关于我们</li>
                    </ul>
                    <ul class='quchuyuanquan'>
                        <li class='tubioayiangs22'><i class="iconfont icon-yiwancheng"></i></li>
                        <li class='liziti4'>捐步数</li>
                    </ul>
                    <ul class='quchuyuanquan'>
                        <li class='tubioayiangs222'><i class="iconfont icon-wodehaoyou"></i></li>
                        <li class='liziti5'>我的好友</li>
                    </ul>
                    <ul class='quchuyuanquan'>
                        <li class='tubioayiangs2222'><i class="iconfont icon-completed"></i></li>
                        <li class='liziti6'>群聊</li>
                    </ul>
                </ul>
            </div>
            <div class="container">
                <div class="liangeitupian"><img src='./tupian/3.png' class='tup3' alt="图片"></div>
                <div class="liangeitupian1"><img src='./tupian/4.png' class='tup4' alt="图片"></div>
            </div>


            <div class='wddingdanxinxi123'>
                <div class='wddiandan'><span class='wddingdanziti'>其他功能</span></div>
                <ul class='ulyihang'>
                    <ul class='quchuyuanquan'>
                        <li class='tubioayiangs3'><i class="iconfont icon-dianzifapiao"></i></li>
                        <li class='liziti7'>电子发票</li>
                    </ul>
                    <ul class='quchuyuanquan'>
                        <li class='tubioayiangs33'><i class="iconfont icon-shouhou"></i></li>
                        <li class='liziti8'>售后</li>
                    </ul>
                    <ul class='quchuyuanquan'>
                        <li class='tubioayiangs333'><i class="iconfont icon-a-24PX-fahuodizhi"></i></li>
                        <li class='liziti9'>收货地址</li>
                    </ul>
                    <ul class='quchuyuanquan'>
                        <li class='tubioayiangs3333'><i class="iconfont icon-lianxikefu"></i></li>
                        <li class='liziti10'>联系客服</li>
                    </ul>
                </ul>
            </div>

        </div>

    </div>

</template>

<script>
import { Icon } from 'vant';
import './my.css'



// import tupian1 from './tupian/1.png'
export default {
    components: {
        'van-icon': Icon
    }
}
</script>
